import 'package:flutter/material.dart';

class BottomBar extends StatelessWidget {
    
    final int cardCount;
    final double scrollPercent;
    
    const BottomBar({Key key, this.cardCount, this.scrollPercent}) : super(key: key);
    
    @override
    Widget build(BuildContext context) {
        return Padding(
            padding: EdgeInsets.only(top: 10.0, bottom: 10.0),
            child: Row(
                
                children: <Widget>[
                    
                    Expanded(
                        child: Center(
                            child: Icon(
                                Icons.settings,
                                color: Colors.white,
                            ),
                        ),
                    ),
                    Expanded(
                        child: Container(
                            width: double.infinity,
                            height: 5.0,
                            child: CustomPaint(
                                painter: ScrollIndicatorPainter(
                                    cardCount: cardCount,
                                    scrollPercent: scrollPercent,
                                ),
                            ),
                        ),
                    ),
                    Expanded(
                        child: Center(
                            child: Icon(
                                Icons.add,
                                color: Colors.white,
                            ),
                        ),
                    ),
                
                ],
            
            ),
        );
    }
}

class ScrollIndicatorPainter extends CustomPainter {
    
    final int cardCount;
    final double scrollPercent;
    
    final Paint track;
    final Paint thumb;
    
    ScrollIndicatorPainter({
        this.cardCount,
        this.scrollPercent,
    })
        :
            track = Paint()
                ..color = const Color(0xFF444444)
                ..style = PaintingStyle.fill,
            thumb =Paint()
                ..color = Colors.white
                ..style = PaintingStyle.fill
    ;
    
    @override
    void paint(Canvas canvas, Size size) {
        canvas.drawRRect(RRect.fromRectAndCorners(Rect.fromLTWH(0, 0, size.width, size.height),
            topLeft: Radius.circular(3.0),
            topRight: Radius.circular(3.0),
            bottomLeft: Radius.circular(3.0),
            bottomRight: Radius.circular(3.0),
        ), track);
        
        final thumbWidth = size.width / cardCount;
        final thumbLeft = scrollPercent * size.width;
        canvas.drawRRect(RRect.fromRectAndCorners(Rect.fromLTWH(thumbLeft, 0, thumbWidth, size.height),
            topLeft: Radius.circular(3.0),
            topRight: Radius.circular(3.0),
            bottomLeft: Radius.circular(3.0),
            bottomRight: Radius.circular(3.0),
        ), thumb);
    }
    
    @override
    bool shouldRepaint(CustomPainter oldDelegate) {
        return true;
    }
    
}
